<!--
 * @Author: huzhanglin 799490931@qq.com
 * @Date: 2023-12-24 13:53:04
 * @LastEditors: huzhanglin 799490931@qq.com
 * @LastEditTime: 2023-12-24 14:55:20
 * @FilePath: \my-app01\src\app\my-ng-if\my-ng-if.component.html
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<p>my-ng-if works!</p>
<p *ngIf="isNgIf else elseBlock">this is a ng-if</p>
<ng-template #elseBlock>Content to render when condition is false.</ng-template>
<div *ngIf="isNgIf2; then thenBlock1 else elseBlock2"></div>
<ng-template #thenBlock1>Content to render when condition is true.</ng-template>
<ng-template #elseBlock2>Content to render when condition is
  false.</ng-template>

<div>
  <div *ngIf="age >18 then ngIf2"></div>
  <ng-template #ngIf2> age > 18</ng-template>
</div>

<div>
  <button (click)="doClick()">点击</button>
  <p *ngIf="hasMore else HasMore"> 还有更多数据</p>
  <ng-template #HasMore>
    没数据了
  </ng-template>

</div>

<button [ngStyle]="myStyleObj" (click)="doAction()"> 按钮 </button>
<button [ngClass]="cssObj" (click)="cssBtn()">cssBtn</button>